<template>
  <div id="title">
    <image
      class="bg"
      v-if="imgtype == 1"
      src="@/static/img/largeScreen/left-nav-bg.png"
    />
    <image v-else class="bg" src="@/static/img/largeScreen/title-bg.png" />

    <view class="text"> {{ msg }}</view>

    <image
      v-if="imgtype == 2"
      class="arrow"
      src="@/static/img/largeScreen/title-arrow.png"
    />
  </div>
</template>

<script>
export default {
  props: {
    msg: {
      title: String,
      default: "标题",
    },
    imgtype: {
      type: Number,
      default: 1,
    },
  },
};
</script>

<style lang="less" scoped>
#title {
  position: relative;
  text-align: left;
  width: 100%;
  background-size: 100%;
  font-family: SourceHanSansCN-Bold;
  font-size: 18px;
  height: 35px;
  .text {
    padding: 0 0 0 5%;
  }
  .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .arrow {
    width: 17px;
    height: 16px;
    margin-left: 10px;
  }
}
</style>
